<template>
<view v-show="show">
  <view class="mask" @click="updateShow"></view>
  <view class="dialog">
    <slot></slot>
  </view>
</view>
</template>

<script>
export default {
  name: "mask",
  props:{
    mask:{
      type: Boolean,
      default: true
    },
    show:{
      type:Boolean
    }
  },
  methods:{
    updateShow(){
      this.$emit('update:show',false)
    }
  }
}
</script>

<style scoped>
.mask{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.7);
  z-index: 0;
}
.dialog{
  position: fixed;
  background-color: #ffffff;
  top: 30%;
  left: 3%;
  z-index: 999;
  border-radius: 25rpx;
  box-shadow: #555555 0 0 5px 1px;
;
}

</style>
